<template>
	<view class="selectBox">
		<view class="selectItem" v-for="(el,index) in classList" :key="index" @click="goDetails(el)">
			<image class="selectImg" :src="el.cover_img" mode=""></image>
			<view class="selectText">
				{{el.name}}
			</view>
		</view>
	</view>
</template>

<script>
	import {
		allVideo
	} from '@/module/index.js'
	const app = getApp()
	export default {
		data() {
			return {
				classList: [],
				params:{
					admin_id:null,
					page:1,
					limit:10,
					total_page:0
				}
			}
		},
		onShow() {

		},
		onLoad(option) {
			this.params.admin_id = option.id
			this.allVideo()
		},
		methods: {
			// 获取视频主信息
			allVideo() {
				//发起请求
				allVideo(this.params).then((res) => {
					if (res.code === 200) {
						this.classList.push(...res.data.data)
						this.params.page++
						this.params.total_page = res.data.total_page
						uni.setNavigationBarTitle({
							title: res.data.user_info.name
						})
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				}).catch(err => {
					console.log(err)
				})
			},
			goDetails(el) {
				uni.navigateTo({
					url: `/components/yjy-video-slide/yjy-video-slide?video_id=` + el.id
				});
			}
		},
		onReachBottom(){
			let {total_page,page} = this.params
			if(page>total_page>0){
				return;
			}
			this.allVideo()
		},
	}
</script>

<style scoped>
	.selectBox {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		padding: 10rpx 2rpx 60rpx;
	}

	.selectBox:after {
		display: block;
		content: "";
		width: 44%;
		height: 0px;
	}

	.selectItem {
		width: 46%;
		margin-bottom: 20rpx;
		border: 1px solid #EAEAEA;
		border-radius: 10rpx;
		/* height: 680rpx; */
	}

	.selectImg {
		width: 100%;
		height: 600rpx;
		border-radius: 10rpx 10rpx 0 0;
		vertical-align: middle;
	}

	.selectText {
		font-weight: bold;
		font-size: 28rpx;
		text-align: center;
		padding:10rpx 0;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
	}
</style>
